<script language="javascript" type="text/javascript">
	function show(div_id){
		show_div_id = "show_"+div_id;
		document.getElementById(show_div_id).style.display = '';
		hide_div_id = "hide_"+div_id;
		document.getElementById(hide_div_id).style.display = 'none';
	}
	function hide(div_id){
		show_div_id = "show_"+div_id;
		document.getElementById(show_div_id).style.display = 'none';
		hide_div_id = "hide_"+div_id;
		document.getElementById(hide_div_id).style.display = '';
	}
</script>
<table border="1">
	<th>Order</th>
	<th>Name</th>
	<th>Sub-Categories</th>
	<th>Status</th>

	<th>Action</th>
	<{foreach from=$categoryList item=phantu}>
		<tr> 
			<td> <{$phantu.cat_id}> </td>
			<td> <{$phantu.cat_name}> </td>	
			<td> 
				<{if $phantu.cat_sub_cate.1}>
				<div id="hide_sub_cate_<{$phantu.cat_id}>"">
					<a href="javascript:show('sub_cate_<{$phantu.cat_id}>')">	
					Show!
					</a>
				</div>
				<div id="show_sub_cate_<{$phantu.cat_id}>" style="display:none">
				<a href="javascript:hide('sub_cate_<{$phantu.cat_id}>')">	
					Hide this!
				</a>
				
				<br/>
				<table border="1" cellpadding="1px" cellspacing="1px">
					<th>Name</th>
					<th>Status</th>
					<th>Action</th>
					<{foreach from=$phantu.cat_sub_cate item=phantu_con}>
						<tr>
							<td> 
								<{$phantu_con.cat_name}> 
							</td>
							<td>
								<{$phantu_con.cat_status}>
							</td>
						<td> 
							<a href="<{$smarty.const.APPLICATION_URL}>
							categories/editForm/<{$phantu_con.cat_id}>">					
							edit 
							</a>
							| 
							<{if $phantu_con.cat_status==1}>
							<a href="<{$smarty.const.APPLICATION_URL}>
											categories/inactive/<{$phantu_con.cat_id}>">		
								Inactive					
							</a> 
							<{else}>
							<a href="<{$smarty.const.APPLICATION_URL}>
								categories/active/<{$phantu_con.cat_id}>">					
							Active					
							</a> 
				<{/if}>
						</td>			
						</tr>
					<{/foreach}>
				</table>
				</div>
				<{else}>
					No sub-categories
				<{/if}>
				
			</td>		
			<td> <{$phantu.cat_status}> </td>		
		
			<td> 
				<a href="<{$smarty.const.APPLICATION_URL}>
					categories/editForm/<{$phantu.cat_id}>">					
					edit 
				</a>
				| 
				<{if $phantu.cat_status==1}>
					<a href="<{$smarty.const.APPLICATION_URL}>
											categories/inactive/<{$phantu.cat_id}>">					
							Inactive					
					</a> 
				<{else}>
					<a href="<{$smarty.const.APPLICATION_URL}>
								categories/active/<{$phantu.cat_id}>">					
							Active					
					</a> 
				<{/if}>
			</td>			
		</tr>
	<{/foreach}>
</table>